<template>
    <a-modal v-model:open="visible.value" title="提醒设置" @cancel="emit('update:modelVisible', false);" width="980px"
        :footer="false">
        <p style="margin: 2% 0 ;"><span style="color: #AAAAAA;">【新建提醒后请添加提醒对象和提醒事项】</span>
            <a-button type="primary" style="float: right;" @click="addRemindModal = true">
                <template #icon>
                    <PlusOutlined />
                </template>
                新增提醒</a-button>
        </p>
        <a-table :columns="columns" :data-source="remindData" bordered>
            <template #bodyCell="{ column, text }">
                <template v-if="column.dataIndex === 'name'">
                    <a>{{ text }}</a>
                </template>
            </template>

        </a-table>
    </a-modal>

    <AddRemindModal v-model:model-visible="addRemindModal" v-on:update:model-visible=" addRemindModal = false">
    </AddRemindModal>
</template>

<script lang="ts" setup>
const props = defineProps({
    modelVisible: {
        type: Boolean,
        default: false
    },
})
const emit = defineEmits(['update:modelVisible']);
const visible = computed(() => {
    return ref(props.modelVisible)
});
const addRemindModal = ref(false);
const columns = [
    {
        title: '提醒人',
        dataIndex: 'name',
        width: '20%',
    },
    {
        title: '提醒时间',
        className: 'column-money',
        dataIndex: 'money',
        width: '30%',
    },
    {
        title: '提醒方式',
        dataIndex: 'address',
        width: '20%',
    },
    {
        title: '操作',
        dataIndex: 'operation',
    },
];
const remindData = null

const handleOk = () => {

    emit('update:modelVisible', false);

};
</script>
